
<%@page import="com.grupo.model.VO.AreaConhecimento"%>
<%@page import="com.grupo.model.DAO.AreaConhecimentoDAO"%>
<%@page import="com.grupo.model.DAO.CienciaConhecimentoDAO"%>
<%@page import="com.grupo.model.VO.CienciaConhecimento"%>
<%@page import="com.grupo.model.DAO.DAO"%>
<%@page import="java.util.List"%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<%@include file="header.jsp" %>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" language="javascript">
    $(document).ready(function(){
	$("#tipoQuestao").change(function(){

	    tipoQuestao = $('#tipoQuestao').find('option').filter(':selected').text();
	});

	$("#cienciaConhecimento").change(function(){
	    valCiencia = $(this).val();
	    if(valCiencia != "null"){
		$.post('vw_loadAreaConhecimento.jsp?id_ciencia='+valCiencia,function(data){
		    $("#areaConhecimento").html(data);
		});
	    }else{
		alert("Escolha um tipo de Ciência do Conhecimento Válida .");
		$(this).focus();
	    }
	})
	cont_alt = 0;
	nw_alt = "<input type='text'/><br>"
	$("#btnIncluirAlt2").click(function(){
	    desc_alternativa = " |";
	    desc_justificativa = " |";
	    bool_questao_verdadeira = " |";
	    if(cont_alt > 0){
		for (i = (cont_alt - 1); i >= 1; i--) {
		    desc_alternativa += $('#desc_alternativa'+i).val();
		    desc_alternativa += "|";
		    bool_questao_verdadeira += $('#bool_questao_verdadeira'+i +' option:selected').val();
		    bool_questao_verdadeira += "|";
		    desc_justificativa += $('#desc_justificativa'+i).val();
		    desc_justificativa += "|";
		}
	    }else{
		cont_alt = 1;
	    }
	    $.post('vw_insertAlternativa.jsp?cont_alt='+cont_alt+'&alt='+desc_alternativa+'&bqv='+bool_questao_verdadeira+'&just='+desc_justificativa,function(data){
		$("#gridAlternativa").html(data);
	    });
	    cont_alt++;
	})

	$("#btnEsvaziar").click(function(){
	    cont_alt = 1;
	    desc_alternativa = " |";
	    desc_justificativa = " |";
	    bool_questao_verdadeira = " |";
	    $.post('vw_insertAlternativa.jsp?cont_alt='+cont_alt+'&alt='+desc_alternativa+'&bqv='+bool_questao_verdadeira+'&just='+desc_justificativa,function(data){
		$("#gridAlternativa").html(data);
	    });
	})

	$('[id*="false"]').attr("disabled","disabled");
	$("#viewQuestSuper").hide();
	$("#fecharView").click(function(){
            $("#viewQuestSuper").hide(800);
	})
	// juliano

	$("#saveQuest").click(function(){
	    valCiencia =  $("#cienciaConhecimento").val();
	    if(valCiencia == "null"){
		alert("É necessário a escolha de uma Ciência do conhecimento para a questão !");
		$("#cienciaConhecimento").focus();

	    }
	    valAreaConhecimento = $("#selectAreaConhecimento option:selected").val();

	    if(valAreaConhecimento == undefined){
		alert("É necessário a escolha de uma Área do conhecimento para a questão !");
		$("#areaConhecimento").focus();
	    }

	    objeto = $("#selectObjetoConhecimento option:selected").val();


	    if(objeto == undefined){
		alert("É necessário a escolha de uma Objeto do conhecimento para a questão !");
		$("#objetoConhecimento").focus();
	    }
	    enuciado = $("textarea#questaoEnunciado").val()
	    if(enuciado == ""){
		alert("Não é possivel gerar um questão sem enuciado.")
                $("#questaoEnunciado").focus();
	    }
	})

	$("#mymodal").click(function(){
	    $("#p_enunciado").text($("#questaoEnunciado").val());
	})
    });

</script>
<style>
    #spanBtnIncluir{
        font-size: 20px;
        position: relative;
    }
    #viewQuest{
        position: relative;
        box-shadow: 1px 2px 6px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 1px 2px 6px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 1px 2px 6px rgba(0, 0, 0, 0.5);
        background-color: buttonface;
        padding-top: 3px;
        padding-left: 3px;
        padding-right: 3px;
        padding-bottom: 3px;


    }
    #viewQuestSuper{
        position: absolute;
        box-shadow: 1px 2px 6px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 1px 2px 6px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 1px 2px 6px rgba(0, 0, 0, 0.5);
        background-color: whitesmoke;
        left: 25%;
        top: 10%;
        width:600px;
        height:auto;
        z-index:100;

    }
    #listaQuest{
        list-style: lower-alpha;
    }
</style>
<%@include file="topo.jsp" %>
<%@include file="menu.jsp" %>
<div class="container-fluid">
    <div class="row-fluid">
	<div class="span4">
	    <form action="CadastrarQuestao" id="formGravaQuestao" name="formulario" target="_self" method="post">
		<table class="table table-condensed table-striped">
		    <tr>
			<td align="center" colspan="2"><strong>GERAR QUESTAO</strong></td>
		    </tr>
		    <tr>
			<td align="left">Data criação:</td><td><% out.println(request.getAttribute("data"));%></td>
			<!-- Passar data por hidden para entrar no banco data criacao -->
		    </tr>
		    <tr>
			<td>Ciência do Conhecimento:</td>
			<td>
			    <select id="cienciaConhecimento" class="span12" name="ciencia_conhecimento_n">
				<option value="null">Selecione:</option>
				<%

				    try {
					CienciaConhecimentoDAO cd = new CienciaConhecimentoDAO();
					List<CienciaConhecimento> lista = cd.listaCiencias();

					for (CienciaConhecimento c : lista) {


				%>
				<option value="<%= c.getCiencia_conhecimento()%>"><%= c.getCiencia_conhecimento()%> - <%= c.getDesc_ciencia_conhecimento()%></option>
				<%
					}
				    } catch (Exception e) {
					out.print("Erro " + e.toString());
				    }
				%></select>
			</td>
		    </tr>
		    <tr>
			<td>
			    Área do conhecimento:</td><td><div id="areaConhecimento"><select id="falseAreaConhecimento" class="span12"><option value="null" >Aguarde...</option></select></div>
			</td>
		    </tr>

		    <tr>
			<td>
			    Objeto do conhecimento:</td><td><div id="objetoConhecimento"><select id="falseObjetoConhecimento" class="span12"><option value="null" >Aguarde...</option></select></div>
			</td>
		    </tr>

		    <tr>
			<td align="left">Tipo da Questao:</td><td align="left"><select id="tipoQuestao" name="tipo_questao_n" class="span12">
				<option value="1">Selecione</option>
				<option value="1">Assertiva</option>
				<option value="2">Objetiva</option>
				<option value="3">Discussiva</option>
			    </select></td>
		    </tr>

		    <tr>
			<td align="left">Grau de Dificuldade:</td><td align="left">
			    <select name="grau_dificuldade_n" id="grauDif"  class="span12">
				<option value='1'>Selecione</option>
				<option value='1'>Fácil</option>
				<option value='2'>Médio</option>
				<option value='3'>Normal</option>
				<option value='4'>Díficil</option>
				<option value='5'>Super Díficl</option>
			    </select>
			</td>
		    </tr>

		    <tr>
			<td align="left">Enunciado:</td><td align="left"><textarea name="desc_questao" rows="3" cols="40" id="questaoEnunciado"  class="span12"></textarea></td>
		    </tr>
		    <tr>
			<td align="left">Alternativa(s):</td>
			<td align="left">
			    <div class="btn-toolbar">
				<div class="btn-group">
				    <a href="#" id="btnIncluirAlt2" class="btn"><i class="icon-plus"></i><b>&nbsp;Adicionar</b></a>
				    <a href="#" id="btnEsvaziar" class="btn"><i class="icon-trash"></i><b>&nbsp;Limpar</b></a>
				</div>
			    </div>
			</td>
		    </tr>
		    <tr>
			<td colspan="2" align="right">
			    <div class="btn-toolbar">
				<div class="btn-group">
				    <input type="submit" class="btn" id="saveQuest" value="Salvar"/>
				    <input data-toggle="modal" data-target="#myModal" type="button" class="btn" name="visualizarQuestao" value="Visualizar" id="viewQuestao"/>
				</div>
			    </div>
			</td>
		    </tr>
		</table>
		<input type="hidden" value="cad" name="op"/>
	    </form>
	</div>
	<div class="span8">
	    <div id="gridAlternativa">

	    </div>
	</div>
    </div>
</div>
<div class="modal hide fade" id="myModal">
    <div class="modal-header">
	<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
	<h3 id="myModalLabel">Questão</h3>
    </div>
    <div class="modal-body">
	Enunciado:<p id="p_enunciado"></p>
	Alternativas:<p id="p_alt"></p>
	<script>
	    $("#questaoEnunciado").keyup(function () {
		var value = $(this).val();
		$("#p_enunciado").text(value);
		var val_alt = "";
		y = 1;
		for (i = (cont_alt - 1); i >= 1; i--) {
		    val_alt += "Nº: " + y + " " + $('#desc_alternativa'+i).val() + "   ( )<br>";
		    y++;
		}
		$("#p_alt").text(val_alt);
	    }).keyup();
	</script>
    </div>
    <div class="modal-footer">
	<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
	<button class="btn btn-primary">Save changes</button>
    </div>
</div>
</body>
</html>
